Ext.onReady(function() {

			Ext.QuickTips.init();

			var headPanel = new App.HeadPanel();
			var moduleTree = new App.ModuleTree('tree.json');
			var modulePanel = new App.ModulePanel();

			var viewport = new Ext.Viewport({
						layout	: 'border',
						items	: [headPanel, moduleTree, modulePanel]
					});

			viewport.doLayout();

			moduleTree.on({
						'click'		: function(node, e) {
							modulePanel.loadModule(node);
						},
						'collapse'	: function() {
							var activeTab = modulePanel.getActiveTab();
							var domId = activeTab.id.substr(4);
							var panel = Ext.getCmp('p-' + domId);
							panel ? panel.doLayout() : null;
						},
						'expand'	: function() {}
					});

			modulePanel.on({
						'tabchange'	: function(tp, tab) {
							var nodeId = String(tab.id.substr(4));// treenode id not tabpanel id
							moduleTree.selectPath('/root/' + [nodeId].join('/'));
						}
					});

			setTimeout(function() {
						Ext.get('loading').remove();
						Ext.get('loading-mask').fadeOut({
									remove	: true
								});
					}, 500);
		});
